<template>
  <view class="approval-opinion" v-if="opinionList.length">
    <view
      class="approval-opinion_item"
      v-for="(item, i) in opinionList"
      :key="i"
    >
      <view class="name">{{ item.name }}：</view>
      <view class="val">{{ item.dealMsg }}</view>
    </view>
  </view>
</template>

<script>
export default {
  props: {
    list: Array,
  },
  data() {
    return {
      opinionList: [],
    };
  },
  watch: {
    list: {
      immediate: true,
      handler: function (e) {
        const arr = [];
        console.log(e, 'item.userList');
        if (e.length) {
          e.forEach((item) => {
            if (item.approveResult > 1 && item.dealMsg) {
              arr.push({ name: item.userName, dealMsg: item.dealMsg });
            }
          });
        }
        this.opinionList = arr;
      },
    },
  },
  methods: {},

  created() {},
};
</script>
<style lang="scss" scoped>
.approval-opinion {
  min-height: 68rpx;
  background: #f2f4f9;
  border-radius: 8rpx;
  margin-top: 16rpx;
  &_item {
    height: 68rpx;
    display: flex;
    align-items: center;
    margin-top: -20rpx;
    &:nth-of-type(1) {
      margin-top: 0;
    }
    .name {
      font-size: 26rpx;
      font-family: PingFangSC, PingFangSC-Regular;
      font-weight: 400;
      color: #999999;
      padding-left: 16rpx;
    }
    .val {
      font-size: 26rpx;
      font-family: PingFangSC, PingFangSC-Regular;
      font-weight: 400;
      text-align: left;
      color: #333333;
    }
  }
}
</style>
